<script lang="tsx">
import { Component, Prop, Vue, Inject } from 'vue-property-decorator';
@Component({
  name: 'ShowIndexRange'
})
export default class ShowIndexRange extends Vue {
  @Prop() private tree: any

  @Inject('ranger') private ranger

  private render (h: any) {
    const min = this.ranger.min
    const max = this.ranger.max
    let slots = this.$slots.default || []
    slots = slots.filter((d: any) => {
      const showIndex = d.data.attrs['show-index'] >= 0 ? d.data.attrs['show-index'] : Infinity
      const needFilter = d.data.attrs['need-filter']
      if (needFilter) {
        return min <= showIndex && showIndex <= max
      }
      return true
    })
    return h(
      'div', {}, slots
    )
  }
}
</script>
